﻿<%@ Page Language="C#" %>

<%@ Import Namespace="wojilu" %>
<%@ Import Namespace="wojilu.View" %>
<%@ Import Namespace="wojilu.Web.Controller" %>
<%@ Import Namespace="wojilu.Apps.Qycms.Domain" %>
<%var site = v.data("site") as m_site; %>
<%var lngs = site.lngs; %>

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>石化集团手机版-#{pageTitle}</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="format-detection" content="telephone=no" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<link href="#{site.waptemplates}css/reset.css" type="text/css" rel="stylesheet" />
<link href="#{site.waptemplates}css/index.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="#{site.dir}js/zepto.1.1.3.js"></script>
<script type="text/javascript" src="#{site.dir}js/banner1.js"></script>
<script src="#{site.dir}js/list.js"></script>
<style>
body{ padding-bottom:80px;}
#wrapper {
	position: relative;
	z-index: 1;
	height: 160px;
	width: 100%;
	background: #ccc;
	overflow: hidden;
	-ms-touch-action: none;
}

#scroller {
	position: absolute;
	z-index: 1;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	width: 2400px;
	height: 160px;
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-text-size-adjust: none;
	-moz-text-size-adjust: none;
	-ms-text-size-adjust: none;
	-o-text-size-adjust: none;
	text-size-adjust: none;
}
#scroller ul {
	list-style: none;
	width: 100%;
	padding: 0;
	margin: 0;
}

#scroller li {
	width: 120px;
	height: 160px;
	float: left;
	line-height: 160px;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	background-color: #fafafa;
	font-size: 14px;
	overflow: hidden;
	text-align: center;
}

</style>
</head>

<body>
<style>
A.applink:hover {border: 2px dotted #DCE6F4;padding:2px;background-color:#ffff00;color:green;text-decoration:none}
A.applink       {border: 2px dotted #DCE6F4;padding:2px;color:#2F5BFF;background:transparent;text-decoration:none}
A.info          {color:#2F5BFF;background:transparent;text-decoration:none}
A.info:hover    {color:green;background:transparent;text-decoration:underline}
</style>
<header>
  <div class="logo"> <img src="#{site.waptemplates}images/logo_03.png" height="40" /> </div>
  <div class="navbtn" id="navbtn"></div>
</header>

#{top}


<section>

  <div id="banner">
    <div class="new-ct main">
      <div style="overflow: hidden;" class="banner scroll-wrapper" id="idContainer2"
             ontouchstart="touchStart(event)" ontouchmove="touchMove(event);" ontouchend="touchEnd(event);">
        <ul class="scroller" style="left:0;width:300%; position: relative;"
                id="idSlider">
            <%var advertlist1 = YBBCommon.GetAdvertList(7, 5, lngs, 1); %>
            <%foreach(var row in advertlist1){ %>
          <li > <a href="<%=row.url %>" name="6"> <img src="<%=row.filename%>"> </a> </li><%} %>

         
        </ul>
        <ul class="new-banner-num new-tbl-type" id="idNum">

        </ul>
      </div>
    </div>
  </div>
  <div id="phone-main1">
    <div id="phone-menu">
      <ul>
        <li><%var t = YBBCommon.GetMenu(1); %><a href="<%=t.gwaplink %>">
          <div class="b_p1"><img src="#{site.waptemplates}images/icon_home1.png" /></div>
          <p>集团简介</p>
          </a></li>
        <li><%t = YBBCommon.GetMenu(71); %><a href="<%=t.gwaplink %>">
          <div class="b_p2"><img src="#{site.waptemplates}images/icon_news.png" /></div>
          <p>石化区介绍</p>
          </a></li>
        <li><%t = YBBCommon.GetMenu(6); %><a href="<%=t.gwaplink %>">
          <div class="b_p3"><img src="#{site.waptemplates}images/icon_product.png" /></div>
          <p>园区开发建设</p>
          </a></li>
        <li><%t = YBBCommon.GetMenu(4); %><a href="<%=t.gwaplink %>">
          <div class="b_p4"><img src="#{site.waptemplates}images/icon_case.png" /></div>
          <p>投资与经营</p>
          </a></li>
        <li><%t = YBBCommon.GetMenu(2); %><a href="<%=t.gwaplink %>">
          <div class="b_p5"><img src="#{site.waptemplates}images/icon_recai.png" /></div>
          <p>新闻资讯</p>
          </a></li>
        <li><%t = YBBCommon.GetMenu(78); %><a href="<%=t.gwaplink %>">
          <div class="b_p6"><img src="#{site.waptemplates}images/icon_confri.png" /></div>
          <p>企业文化</p>
          </a></li>
    
        <li><%t = YBBCommon.GetMenu(7); %><a href="<%=t.gwaplink %>">
          <div class="b_p9"><img src="#{site.waptemplates}images/icon_map.png" /></div>
          <p>招贤纳士</p>
          </a></li>
        <li><%t = YBBCommon.GetMenu(5); %><a href="<%=t.gwaplink %>">
          <div class="b_p10"><img src="#{site.waptemplates}images/icon_email.png" /></div>
          <p>基层党建</p>
          </a></li>
      </ul>
    </div>
    <div id="phone-news">
      <div class="news-title"> 集团新闻
        <p>News Corp</p>
      </div>
      <ul>
          <%var jtnews = YBBCommon.GetListRead(61, 4); %>
          <%foreach(var row in jtnews){ %>
      	<li><a  href="<%=row.readwaplink %>">    <%=YBBCommon.LeftByt(row.title,34) %><span></span></a> </li><%} %>
      </ul>
    </div>
 
  <div id="phone-about1" class="p20">
    <div class="news-title"> 关于我们
      <p>About us</p>
    </div>
    <div class="phone-a-main" style="padding:0 10px;">
        <%var about = YBBCommon.GetReadDr(18); %>
        <%if(about !=null){ %>
        <%=about["indexcontent"] %>
        <%} %>
    </div>
  </div>
  <div id="phone-six" class="p20">
    <div class="news-title"> 园区要闻
      <p>The park highlights</p>
    </div>
    <div class="phone-six-main">
      <ul>
          <%var dt = YBBCommon.GetReadDt("72,77,54,46", 1, 4); %>
          <%foreach(var row in dt){ %>
        <li>
          <div class="pic"><a href="<%=row.readwaplink %>"><img src="<%=row.pic %>" width="100" /></a></div>
          <h2><%=row.title %></h2>
          <p><%=YBBCommon.LeftByt(YBBCommon.RemoveHtml(row.content),160) %>...</p>
        </li><%} %>
      </ul>
    </div>
  </div>
  <div id="phone-cases" class="p20">
    <div class="news-title"> 园区景观
      <p>Park Landscape</p>
    </div>
    <ul>
        <%var dt1 = YBBCommon.GetListRead(84, 4); %>
        <%foreach(var row in dt1){ %><li><a  href="<%=row.readwaplink %>"> <img src="<%=row.pic%>" />
        <P><%=YBBCommon.LeftByt(row.title,22) %></P></a> </li><%} %>
    </ul>
  </div>
  
 </div>

</section>
    #{bottom}
<script>
                //活动轮播图
                var picCount = $(".scroller>li").length;
                $(".scroller").css('width',100*picCount+"%");
                $(".pic-num1").css("width", (picCount * 30) + "px");
                var sl = picCount,sw;
                var _startX,_startY,index = 0,moveX,moveY,_endX,_endY,idSliderLeft = $("#idSlider").css('left'),auto = false,play = true;
                var nums = [];
                //插入数字
                for (var i = 0,
                n = picCount - 1; i <= n; i++) {
                    var li = document.createElement("li");
                    nums[i] = document.getElementById("idNum").appendChild(li);
                }
                // 重新设置浮动
                $("#idSlider").css("position", "relative");

                function touchStart(event) {
                    _startX = event.touches[0].clientX;
                    _startY = event.touches[0].clientY;
                }
                function touchMove(event) {
                    var touch = event.touches[0];
                    _endX = event.touches[0].clientX;
                    _endY = event.touches[0].clientY;
                    moveX = Math.abs(touch.clientX - _startX);
                    moveY = Math.abs(touch.clientY - _startY);
                    if (moveY > moveX) {
                        return;
                    }
                    event.preventDefault();
                }
                //触屏结束事件
                function touchEnd(event) {
                    var _absX = Math.abs(_endX - _startX);
                    var lastX = parseInt($('#idSlider').css('left'));
                    if (_startX > _endX) {
                        Stop();
                        $('#idSlider').css('left',  lastX - sw);
                        index++;
                    } else {
                        Stop();
                        $('#idSlider').css('left', lastX + sw);
                        index--;
                    }
                    if(index < 0){
                        index = sl - 1;    
                        $('#idSlider').css('left',  - index*sw);
                    }
                    if(index > sl - 1){
                        index = 0;    
                        $('#idSlider').css('left',  0);
                    }
                    $(".new-banner-num li").addClass("new-tbl-cell").eq(index).addClass("on").siblings().removeClass('on');
                    _startX = _endX;
                    if(sl > 1){
                        autoPlay();
                    }
                    event.preventDefault();
                }
                var num = 0;
                var resetScrollEle = function() {
                    num++;
                    var slider2Li = $("#idSlider li");
                    var lastX = parseInt($('#idSlider').css('left'));
                    slider2Li.css("width", $(".scroll-wrapper").width() + "px");
                    sw = slider2Li.width();
                    $("#idSlider").css('left',-index*sw);
                    $(".new-banner-num li").addClass("new-tbl-cell").eq(index).addClass("on").siblings().removeClass('on');
                }

                window.addEventListener("resize",
                function() {
                    resetScrollEle();
                });
                window.addEventListener("orientationchange",
                function() {
                    resetScrollEle();
                })
                resetScrollEle();
                function autoPlay(){
                    window.clearTimeout(this.timer);    
                    if(auto){
                        var lastX = parseInt($('#idSlider').css('left'));
                        $('#idSlider').css('left',  lastX - sw);
                        index++;
                        if(index < 0){
                            index = sl - 1;    
                            $('#idSlider').css('left',  - index*sw);
                        }
                        if(index > sl - 1){
                            index = 0;    
                            $('#idSlider').css('left',  0);
                        }
                        $(".new-banner-num li").addClass("new-tbl-cell").eq(index).addClass("on").siblings().removeClass('on');
                    }
                    this.timer = window.setTimeout(function(){auto = true;autoPlay()},3000)
                }
                function Stop(){
                    window.clearTimeout(this.timer);    
                    auto = false;
                }
                if(play){
                    if(sl > 1){
                        autoPlay();
                    }
                }  

</script>

</body>
</html>